<!--
 * @Author: leechoy 1419352779@qq.com
 * @Date: 2024-04-14 14:12:09
 * @LastEditors: leechoy 1419352779@qq.com
 * @LastEditTime: 2024-06-17 02:24:11
 * @FilePath: /H5_SCAN/Front/H5_SCAN/src/views/dashboard/workplace/components/quick-operation.vue
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
-->
<template>
  <a-card
    class="general-card"
    :title="$t('workplace.quick.operation')"
    :header-style="{ paddingBottom: '0' }"
    :body-style="{ padding: '24px 20px 0 20px' }"
  >
    <template #extra>
    </template>
    <a-row :gutter="8">
      <a-col v-for="item in group" :key="item.text" :span="8" class="wrapper" @click="navPath(item)">
        <div class="icon">
          <component :is="item.icon" />
        </div>
        <a-typography-paragraph class="text">
          {{ $t(item.text) }}
        </a-typography-paragraph>
      </a-col>
    </a-row>
    <a-divider class="split-line" style="margin: 0" />
  </a-card>
</template>

<script lang="ts" setup>

import { useRouter } from 'vue-router'
const router = useRouter();
  const group = [
    { text: '地址管理', icon: 'icon-file' ,path:"/scan/urlManage"},
    { text: '检测结果', icon: 'icon-storage' },
    { text: '用户设置', icon: 'icon-settings' },
    { text: '快速检测', icon: 'icon-thunderbolt' },
    { text: '数据分析', icon: 'icon-dashboard' ,path:"dashboard/workplace"},
  ];
  const navPath = (res:any)=>{
    console.log(res.path);
    res.path && router.push(res.path);
  }
</script>

<style scoped lang="less"></style>
